<template>
	<view>
		<image :src="picurl" mode=""></image>
		<!-- <image :src="arrs[1]" mode=""></image> -->
		<button :loading="false" type="warn">按钮</button>
	</view>
	<view :class="[isActive,{box2:isBox2}]" :style="{fontSize:size+'px'}">
			内联样式
	</view>
</template>

<script setup>
	// const picurl = "/static/pic1.png"
	import {ref} from "vue";
	const arrs = ref(["/static/pic1.png","/static/pic2.png"])
	const picurl = ref("/static/pic1.png")
	const isActive = ref("box");
	const isBox2 = ref(true);
	const size = ref(20)
	
	let i = 0;
	setInterval(()=>{
		picurl.value = arrs.value[i%2];
		isBox2.value = !isBox2.value;
		// size.value ++;
		i ++ ;
	},1000);

	
</script>

<style lang="scss">
	.box{
		background-color: green;
		width: 100px;
		height: 100px;
	};
	.box2{
		border: 3px solid red;	
	}
</style>
